﻿@{
    Layout = "~/Views/Shared/_FormGray.cshtml";
}

<div class="wrapper animated fadeInRight">
    <form id="form" class="form-horizontal m">

        <div class="form-group">
            <label class="col-sm-3 control-label ">Environment:  </label>
            <div class="col-sm-8">

                <div id="outboundFlowId" col="outboundFlowId"></div>
            </div>
        </div>
        <br />
        <div class="form-group">
            <label class="col-sm-3 control-label ">Phone Number</label>
            <div class="col-sm-1">
                <select name="telephonePrefix" id="telephonePrefix" class="form-control select2">
                    <option value="+1">+1</option>
                    <option value="+52">+52</option>
                    <option value="+86">+86</option>
                </select>
            </div>
            <div class="col-sm-7">
                <input id="telephone" col="Telephone" type="text" class="form-control" />
            </div>
        </div>
        <div class="form-group">

        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label ">Contact Name</label>
            <div class="col-sm-8">
                <input id="consumerName" col="ConsumerName" type="text" class="form-control" />
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label ">Date of Birth</label>
            <div class="col-sm-8">
                <input id="dateOfBirth" col="DateOfBirth" type="text" class="form-control" />
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label "> </label>
            <div class="col-sm-8">
                <button id="btnSend" class="btn btn-primary " type="button"><i class="fa fa-check"></i>&nbsp;Test</button>
            </div>
        </div>

    </form>
</div>

<script type="text/javascript">
    var id = ys.request("id");
    $(function () {
        //getForm();
      //getForm();
        $("#outboundFlowId").ysComboBox({
            url: '@Url.Content("~/BusinessManage/OutboundFlow/GetListJson?Project=HealthCare")',
            key: "Id",
            value: "Environment",
            class: "form-control",
            multiple: false
          });

        $('#form').validate({
            rules: {
                outboundFlowId: { required: true },
                telephone: { required: true },
                consumerName: { required: true},
                telephonePrefix: { required: true },
                dateOfBirth: { required: true },
            }
        });
        $("#btnSend").click(saveForm);

        laydate.render({ elem: '#dateOfBirth', format: 'MM/dd/yyyy', value: new Date(-765187200000), lang: 'en' });
    });

    function getForm() {

        if (id > 0) {
            ys.ajax({
                url: '@Url.Content("~/BusinessManage/PhoneNumber/GetFormJson")' + '?id=' + id,
                type: 'get',
                success: function (obj) {
                    if (obj.Tag == 1) {
                        $('#form').setWebControls(obj.Data);
                    }
                }
            });
        }
        else {
            var defaultData = {};
            $('#form').setWebControls(defaultData);
        }
    }

    function saveForm(index) {
        if ($('#form').validate().form()) {
            var postData = $('#form').getWebControls({ Id: id });
            postData.telephonePrefix = $("#telephonePrefix").select2("val");

            ys.ajax({
                url: '@Url.Content("~/BusinessManage/PhoneNumber/SendOutboundCall")',
                type: 'post',
                data: postData,
                success: function (obj) {
                    if (obj.Tag == 1) {
                        ys.msgSuccess(obj.Message);
                        //parent.searchGrid();
                        //parent.layer.close(index);
                    }
                    else {
                        ys.msgError(obj.Message);
                    }
                }
            });
        }
    }
</script>

